<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>智慧社区SaaS服务平台 | Login</title>
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">

    <!--    通过 base.js   引入 js 文件-->
    <script src="/pages/base.js"></script>

    <style>

        .bg{
            background: rgb(1, 92, 242);
        }

        .desc {
            text-align: center;
            margin-bottom: 50px;
        }
    </style>

</head>

<script>
    window.onload = function () {
        if (window.parent.window != window) {
            window.top.location = "/login.html";
        }
    }
</script>

<body class="bg">
<div class="login-box" id="app">

    <div class="login-box-body">

        <div class="desc">
            <p style="font-size:26px;">智慧社区SaaS服务平台</p>
            <p style="font-size:14px;">SaaS service platform of smart community</p>
        </div>

        <p class="login-box-msg">登录系统</p>
        <form action="#" method="post">
            <div class="form-group has-feedback">
                <input type="text" name="username" v-model="user.username" class="form-control" placeholder="用户名">
                <span class="glyphicon glyphicon-user form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="password" name="password" v-model="user.password" class="form-control" placeholder="密码">
                <span class="glyphicon glyphicon-lock form-control-feedback"></span>
            </div>
            <div class="row">
                <div class="col-xs-8">
                    <div class="checkbox icheck">
                        <label class=""></label>
                    </div>
                </div>
                <div class="col-xs-4">
                    <button type="button" @click="login" class="btn btn-primary btn-block btn-flat">登录</button>
                </div>
            </div>
        </form>
    </div>
</div>
<script>
    new Vue({
        el: "#app",
        data: {
            user:{
                username:"zhang",
                password:"123"
            }
        },
        methods: {
            //点击登录事件
            login(){
                axios({
                    method:"POST",
                    url:"http://localhost:8080/login",
                    data:this.user
                }).then(resp=>{
                    alert(resp.data.msg);
                    // 跳转到主页
                    location.href = "/pages/home/main.html";
                })
            }
        }
    });
</script>

</body>
</html>
